<!doctype html>
<html class="no-js">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="关于北师in">
    <meta name="keywords" content="北师in,蓁奕科技,珠海蓁奕互联网科技有限公司,岑嘉文,谢俊文,林良如,刘桂杉,黄倩兰">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>品学联萌</title>
    <meta name="renderer" content="webkit">
    <link rel="icon" type="image/png" href="http://res.zhen-yee.com/res/bnu/bitbug_favicon.ico">
    <link rel="apple-touch-icon-precomposed" href="http://res.zhen-yee.com/res/bnu/bitbug_favicon.ico">
    <meta name="apple-mobile-web-app-title" content="关于北师in" />
    <link href="https://cdn.bootcss.com/amazeui/2.7.2/css/amazeui.min.css" rel="stylesheet">
    <style type="text/css">
    a {
        color: #2E8B57;
    }

    .bg {
        background: red;
    }

    .logoframe {}

    .logobg {
        padding-top: 8px;
        /*background: yellow;*/
    }

    .content {
        /*margin: 2 auto;*/
        /*padding: 2px;*/
        /*background: darkcyan;*/
        /*border: 1px solid darkslategray;*/
        border-radius: 6px;
        /*text-align: center;*/
        background: #f6f6f6;
    }

    .content2 {
        padding: 8px;
    }

    .logo {
        width: 45px;
        height: 45px;
        /*border: 1px solid darkslategray;*/
        border-radius: 6px;
    }

    .inputFrame {
        background: white;
    }
    </style>
</head>

<body>
    <div id="app">
        <hr/>
        <#assign logo='https://i.loli.net/2018/05/11/5af50d7591443.jpg' />
        <#assign logo='https://tse4-mm.cn.bing.net/th?id=OIP.y91Dn5xlrCnzgMGWsXCypAHaHa&w=196&h=196&c=7&o=5&pid=1.7' />
        <#assign content='开头,你怎么那么会书画呢,这个很长很长很长,你怎么那么会书画呢,这个很长很长很长,你怎么那么会书画呢,这个很长很长很长,你怎么那么会书画呢,这个很长很长🙂很长,结束' />
        <#list [] as item>
            <div class="am-g">
                <div class="am-u-sm-2 logobg">
                    <img src="${logo}" class="logo">
                </div>
                <div class="am-u-sm-8">
                    <p class="content">${content!''}</p>
                </div>
                <div class="am-u-sm-2"></div>
            </div>
            <div class="am-g">
                <div class="am-u-sm-offset-2 am-u-sm-8 bg">
                    <p class="content">${content!''}</p>
                </div>
                <div class="am-u-sm-2">
                    <img src="${logo}" class="logo">
                </div>
            </div>
        </#list>
        <template v-for='(item,index) in msg'>
            <div class="am-g">
                <div class="am-u-sm-2 logobg am-text-center logoframe">
                    <a href="/fd">
                        <img src="${logo}" class="logo">
                    </a>
                </div>
                <div class="am-u-sm-8">
                    <div class="content">
                        <p class="am-text-sm content2">
                            ${content!''}</p>
                    </div>
                </div>
                <div class="am-u-sm-2"></div>
            </div>
            <div class="am-g">
                <div class="am-u-sm-offset-2 am-u-sm-8">
                    <div class="content">
                        <p class="am-text-sm content2">
                            ${content!''}${content!''}${content!''}${content!''}${content!''}</p>
                    </div>
                </div>
                <div class="am-u-sm-2 logobg">
                    <img src="${logo}" class="logo">
                </div>
            </div>
        </template>
        <div style="height: 40px;"></div>
        <div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default" id="">
            <div class="am-g">
                <div class="am-u-sm-10 inputFrame">
                    <input type="" name="" style="width: 100%" placeholder="请输入" />
                </div>
                <div class="am-u-sm-2" @click='send'>发送</div>
            </div>
        </div>
    </div>
    <script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data: {
            message: 'Hello Vue!',
            msg: [1]
        },
        methods: {
            send: function() {
                this.msg.push(1)
                setTimeout(function() {
                    document.scrollingElement.scrollTop = document.scrollingElement.scrollHeight;
                }, 150);
            }
        }
    })
    </script>
</body>

</html>